<!DOCTYPE html>
<html lang="zh">

	<head>
		<meta charset="UTF-8" />
		<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
		<meta name="viewport" content="width=320,maximum-scale=1.3,user-scalable=no">
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<meta name="x5-orientation" content="portrait" />
		<meta name="x5-fullscreen" content="true" />
		<meta name="screen-orientation" content="portrait" />
		<meta name="full-screen" content="yes" />
		<link rel="stylesheet" type="text/css" href="css/reset.css" />
		<link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.2/style/weui.min.css">
		<link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.0/css/jquery-weui.min.css">
		<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
		<script src="" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="js/index.js"></script>
		<style>
			dd,
			dt,
			body,
			html,
			* {
				max-height: 9999px !important;
				max-width: 9999px !important;
				-webkit-text-size-adjust: 100% !important;
				-moz-text-size-adjust: 100% !important;
				-ms-text-size-adjust: 100% !important;
				text-size-adjust: 100% !important;
			}
			
			header {
				width: 100%;
				height: 1.76rem;
				background: #ffffff;
				border-bottom: 1px solid #e2e3e4;
				line-height: 1.76rem;
			}
			
			header a {
				width: 1.2rem;
				height: 1.76rem;
				background: url(./images/icon/icon_14.png) no-repeat center;
				background-size: 0.46rem 0.58rem;
				float: left;
			}
			
			header i {
				text-align: center;
				display: block;
				font-size: 0.72rem;
				color: #000000;
				margin-right: 1.2rem;
			}
			
			.tc {
				text-align: center;
			}
			
			.weui-cell__bd {
				width: 33.3%;
				max-width: 33.3%;
			}
			
			.hh {
				font-size: 14px;
				word-wrap: break-word;
				word-break: normal;
			}
		</style>
		<title>贷后列表</title>
	</head>

	<body>
		<header>
			<p>
				<a href="daihou.html"></a>
				<i>还款管理详情</i>
			</p>
		</header>
		<div id="tb-list">
			<script id="tb-list-box" type="text/html">
				{{each list as rs i}}
				<div class="weui-cells tc">
					<div class="weui-cell">
						<div class="weui-cell__bd">{{rs.number}}期</div>
						<div class="weui-cell__bd">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
						<div class="weui-cell__bd">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div>
					</div>
					<div class="weui-cell">
						<div class="weui-cell__bd">
							<p>预期还款时间</p>
							<p class="hh">{{rs.time|formatDate}}</p>
						</div>
						<div class="weui-cell__bd">
							<p>月供金额</p>
							<p class="hh">{{rs.monthMoney}}</p>
						</div>
						<div class="weui-cell__bd">
							<p>还款状态</p>
							<p class="hh" style="{{if rs.repay=='REPAYMENT_COMPLETION'}}color: green;{{else/}}color: red;{{/if}}">{{rs.repaymentState|repaymentState}}</p>
						</div>
					</div>
				</div>
				{{/each}}
			</script>
		</div>
	</body>
	<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
	<script src="https://cdn.bootcss.com/jquery-weui/1.2.0/js/jquery-weui.min.js"></script>
	<script src="js/template.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		init();

		function init(curr) {
			$.get(site + "/AfterLoan/queryStagingDetail", {
				"loanId": GetQueryString("loanId"),
			}, function(da) {
				$("#tb-list").html(template('tb-list-box', {
					list: da.data
				}));
			});
		}

		/* 解析地址栏参数 */
		function GetQueryString(name) {
			var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
			var r = encodeURI(window.location.search).substr(1).match(reg);
			if(r != null) return unescape(r[2]);
			return null;
		}

		/*时间戳转换*/
		function formatDate(times) {
			/*时间渲染*/
			function add(m) {
				return m < 10 ? '0' + m : m
			}
			var time = new Date(times);
			var y = time.getFullYear();
			var m = time.getMonth() + 1;
			var d = time.getDate();
			var h = time.getHours();
			var mm = time.getMinutes();
			var s = time.getSeconds();
			return y + '-' + add(m) + '-' + add(d);
		}

		/*还款状态*/
		function repaymentState(val) {
			if(val == "NON_REPAYMENT") {
				return "未还款";
			} else if(val == "REPAYMENT") {
				return "还款中";
			} else if(val == "REPAYMENT_COMPLETION") {
				return "还款完成";
			} else if(val == "CANCEL") {
				return "取消";
			} else if(val == "REPAYMENT_FAIL") {
				return "还款失败";
			} else {
				return val;
			}
		}
	</script>

</html>